<template>
  <div class="about">
    <h1>This is an about page</h1>
    <button @click="addCount">计数器 {{count}}</button>
    <br/>
    <button @click="increment">storeCount {{storeCount}} </button>
  </div>
</template>

<script>
  import store from '@/store'

  export default {
    name: "About",

    data(){
      return {
        count:0,
        storeCount:store.state.count
      }
    },
    methods:{

      addCount(){
        this.count++
      },
      increment(){
        store.increment()
        this.storeCount=store.state.count
      }
    }

    // //组件内守卫
    // //组件内路由 路由切换【进入】时触发
    // beforeRouteEnter(to,from,next){
    //   console.log("进入组件时")
    //   console.log("about from=",from)
    //   console.log("about to=",to)
    //   next()
    // },
    // beforeRouteLeave(to,from,next){
    //   console.log("离开组件时")
    //   next(true)
    // }
  }
</script>

